import Vue from 'vue'
import vuex from 'vuex'
import axios from 'axios'

//应用（使用）vuex这个插件
Vue.use(vuex)

//响应组件中动作的方法们 —— 服务员
const actions = {
	jiaOdd({commit,state},value){
		if(state.sum % 2){
			commit('JIA',value)
		}
	},
	jiaWait({commit},value){
		setTimeout(()=>{
			commit('JIA',value)
		},500)
	},
	async jiaServer({commit}){
		try {
			const result = await axios.get('https://api.uixsj.cn/hitokoto/get?type=social')
			console.log(result.data)
			commit('JIA',result.data.length)
		} catch (error) {
			alert(error.message)
		}
	}
}

//真正去修改数据的方法们 —— 后厨
const mutations = {
	JIA(state,value){
		console.log('mutations中的JIA方法被调用了----后厨')
		state.sum += value
	},
	JIAN(state,value){
		console.log('mutations中的JIAN方法被调用了----后厨')
		state.sum -= value
	}
}

// 初始化的数据 —— 原材料
const state = {
	sum:1,
	school:'atguigu',
	address:'宏福科技园'
}  

// getters中的方法何时调用——有人访问对应数据的时候调用
const getters = {
	bigSum(state){
		return state.sum * 10
	},
	bigSchool(state){
		return state.school.toUpperCase()
	}
}

//创建整个vuex中最重要的角色——store（相当于餐厅总经理）
const store = new vuex.Store({
	actions, //服务员
	mutations,//后厨
	state,//原材料
	getters //加工器
})

//暴露store
export default store